<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="../static/js/jquery-1.8.2.min.js"></script>
</head>
<body>
<div class="container">
    <img src="https://gcy-image.oss-cn-shanghai.aliyuncs.com/%E5%AE%9E%E8%AE%AD%E4%B8%80/%E5%9C%B0%E5%9D%80.png" alt="" width="100%" height="100%">
    <form role="form" action="/ali/pay" method="post">
        <div class="form-group">
            <div class="row">
                <div class="col-md-3">
                    <img id="img" src="" alt="">
                </div>
                <div class="col-md-5">
                    <div><span class="goodsName" style="font-size: 30px"></span><input type="text" hidden name="subject" class="goodsName"><input type="text" name="middleId" hidden id="middleId"></div>
                    <br>
                    <div style="font-size: 25px;color: red">￥<span id="goodsPrice"></span></div>
                    <br>
                    <div style="font-size: 20px;color: red">每件到手价￥<span class="eventPrice"></span><input type="text" name="totalAmount" hidden class="eventPrice"></div>
                    <div><span id="endTime" hidden></span><span id="djs" style="color: red"></span></div>
                    <input type="text" hidden id="description" name="body">
                </div>
            </div>
        </div>

        <div class="form-group" style="text-align: right">
            <input type="submit" value="提交订单" class="btn btn-danger" style="color: white">
        </div>
    </form>
</div>
</body>
<script>
    $.post(
        "/order/echo",
        {"middleId":[[${param.middleId}]]},
        function (a) {
            $("#img").attr("src",a.goodsImg);
            $(".goodsName").html(a.goodsName);
            $(".goodsName").val(a.goodsName);
            $("#goodsPrice").html(a.goodsPrice);
            $(".eventPrice").html(a.eventPrice);
            $(".eventPrice").val(a.eventPrice);
            $("#endTime").html(a.endTime);
            $("#description").val(a.description);
            $("#middleId").val([[${param.middleId}]]);
            var time = new Date($("#endTime").html()).getTime()-new Date().getTime();
            $("#djs").html((Math.floor(time/1000/3600))+":"+Math.floor(time/1000/60%60)+":"+Math.floor(time/1000%60)+" 秒杀即将结束，优惠不等人")
        }
    )

    function refresh(){
        $.post(
            "/order/echo",
            {"middleId":[[${param.middleId}]]},
            function (a) {
                var time = new Date($("#endTime").html()).getTime()-new Date().getTime();
                $("#djs").html((Math.floor(time/1000/3600))+":"+Math.floor(time/1000/60%60)+":"+Math.floor(time/1000%60)+" 秒杀即将结束，优惠不等人")
            }
        )
    }

    setInterval(refresh,1000);

    // $("#buy").click(function () {
    //     $.post(
    //         "/indent/addOrder",
    //         {"middleId":[[${param.middleId}]]}
    //     )
    // })

</script>
</html>
